<script setup>
import {ref,defineEmits,defineProps} from "vue";
import {useRouter} from "vue-router"
import { pcaTextArr } from "element-china-area-data";
import request  from '@/api/request'
let router = useRouter();

let emits=defineEmits(["ref-table"])
let props=defineProps(["data"])
let quotation=ref({...props.data})

let customerResources=ref([])
let warehouse=ref([])
let User=ref([])

quotation.value.quotaionShippingAddress=quotation.value.quotaionShippingAddress.split(",");


let isVisible=ref(false)
let title=ref("")
let data1=ref({})

let refTanle1=(a)=>{
    isVisible.value=false;
    quoteDetails.value=a.value;
    for(let i = 0 ;i<quoteDetails.value.length;i++){
        quoteDetails.value[i].quoteDetailsProductsId=quoteDetails.value[i].materialId;
        quoteDetails.value[i].quoteDetailsUnit=quoteDetails.value[i].unit;
        quoteDetails.value[i].quoteDetailsCost=quoteDetails.value[i].cost;
        quoteDetails.value[i].material={};
        quoteDetails.value[i].material.materialName=quoteDetails.value[i].materialName;
        quoteDetails.value[i].material.specificationsAndModels=quoteDetails.value[i].specificationsAndModels;
        quoteDetails.value[i].material.materialOrProduct=quoteDetails.value[i].materialOrProduct;
        quoteDetails.value[i].material.category=quoteDetails.value[i].category;
    }
    
}
//新增
let toInsert=()=>{
    title.value="添加详情";
    isVisible.value=true;
    router.push("/sale/quotation/materialMainS");
}

let onSubmit=()=>{
    quotation.value.quotaionShippingAddress=quotation.value.quotaionShippingAddress.toString();
        request({
            url:"/quotation",
            method:"put",
            data:quotation.value
        }).then(res=>{
           
        })
        request({
            url:"/quoteDetails/"+quotation.value.quotationId,
            method:"put",
            data:quoteDetails.value
        }).then(res=>{
            emits("ref-table")
        })  
}

let quoteDetails=ref([])


let location=()=>{
    request({
        //查询员工
            url:"/system/user/list",
            method:"post",
            data:{
                current:1,
                size:1000
            }
        }).then(res=>{
            User.value=res.data.records
        })
    request({
        //查询客户
        url:"/CustomerResources",
        method:"get",
        params:{
            current:1,
            size:5
    }
    }).then(res=>{
        customerResources.value=res.data.records
    })

    request({
        //查询客户
        url:"/warehouse",
        method:"get",
        params:{
            current:1,
            size:5
    }
    }).then(res=>{
        warehouse.value=res.data.date
    })
    request({
        //查询客户
        url:"/quoteDetails/select",
        method:"get",
        params:{
            current:1,
            size:5,
            quoteDetailsQuotationId:quotation.value.quotationId
    }
    }).then(res=>{
        quoteDetails.value=res.data.records;
    })
}

location();

//计算原价
let jisuan=()=>{

    let quotationOriginalSalePrice=0
    for(let i=0;i<quoteDetails.value.length;i++){
        if(quoteDetails.value[i].quoteDetailsNumberOfSales != null){
            quoteDetails.value[i].quoteDetailsTotalCost=quoteDetails.value[i].quoteDetailsCost*quoteDetails.value[i].quoteDetailsNumberOfSales;
        }else{
            quoteDetails.value[i].quoteDetailsTotalCost=quoteDetails.value[i].quoteDetailsCost
        }

       if(quoteDetails.value[i].quoteDetailsUnitPriceOfTheSale!=null && quoteDetails.value[i].quoteDetailsNumberOfSales!= null &&i==quoteDetails.value.length-1){
         quotationOriginalSalePrice+=quoteDetails.value[i].quoteDetailsUnitPriceOfTheSale*quoteDetails.value[i].quoteDetailsNumberOfSales;
            quotation.value.quotationOriginalSalePrice=quotationOriginalSalePrice;
        }else if(quoteDetails.value[i].quoteDetailsUnitPriceOfTheSale!=null && quoteDetails.value[i].quoteDetailsNumberOfSales!= null){
            quotationOriginalSalePrice+=quoteDetails.value[i].quoteDetailsUnitPriceOfTheSale*quoteDetails.value[i].quoteDetailsNumberOfSales;
        }

        if(quoteDetails.value[i].quoteDetailsUnitPriceOfTheSale!=null){
            quoteDetails.value[i].quoteDetailsPrice=quoteDetails.value[i].quoteDetailsUnitPriceOfTheSale;
        }
    }
}
//计算实际销售总价
let jisuan1=()=>{
    let quoteDetailsActualSellingPrice=0;
    for(let i=0;i<quoteDetails.value.length;i++){

        if(quoteDetails.value[i].quoteDetailsActualSellingPrice!=null && quoteDetails.value[i].quoteDetailsNumberOfSales!= null &&i==quoteDetails.value.length-1){
            quoteDetailsActualSellingPrice+=quoteDetails.value[i].quoteDetailsActualSellingPrice*quoteDetails.value[i].quoteDetailsNumberOfSales;
            quotation.value.quotationSalesActually=quoteDetailsActualSellingPrice
        }else if(quoteDetails.value[i].quoteDetailsActualSellingPrice!=null && quoteDetails.value[i].quoteDetailsNumberOfSales!= null){
            quoteDetailsActualSellingPrice+=quoteDetails.value[i].quoteDetailsActualSellingPrice*quoteDetails.value[i].quoteDetailsNumberOfSales;
        }

        if(quoteDetails.value[i].quoteDetailsActualSellingPrice!=null && quoteDetails.value[i].quoteDetailsNumberOfSales!= null){
            quoteDetails.value[i].quoteDetailsActualTotal=quoteDetails.value[i].quoteDetailsActualSellingPrice*quoteDetails.value[i].quoteDetailsNumberOfSales;
        }
        
    }
}
//计算实际售价/单价（不含税）
let jisuan2=()=>{
    for(let i=0;i<quoteDetails.value.length;i++){
        if(quoteDetails.value[i].quoteDetailsNoActualSellingPrice!=null && quoteDetails.value[i].quoteDetailsNumberOfSales!= null){
            quoteDetails.value[i].quoteDetailsNoActualTotal=quoteDetails.value[i].quoteDetailsNoActualSellingPrice*quoteDetails.value[i].quoteDetailsNumberOfSales;
        }
    }
}
//计算实际销售总价（不含税）
let shuliang=()=>{
    jisuan();
    jisuan1();
    jisuan2();
    if(quotation.value.quotationOriginalSalePrice!=null && quotation.value.quotationSalesActually!=null && quotation.value.quotationOriginalSalePrice>=quotation.value.quotationSalesActually){
        quotation.value.quotationDiscountAmount=quotation.value.quotationOriginalSalePrice-quotation.value.quotationSalesActually;
        quotation.value.quotationDiscountRate=(quotation.value.quotationSalesActually/quotation.value.quotationOriginalSalePrice).toFixed((2));
        quotation.value.quotationTheAmountIsCapitalized=convertToRMB(quotation.value.quotationSalesActually);
        quotation.value.quotationTheAmountOfTheSale=quotation.value.quotationSalesActually*0.95;
    }
}

function convertToRMB(amount){
    const digits =['零','壹','贰','叁','肆','伍','陆','柒','捌','玖'];
    const units =['','拾','佰','仟','万','拾万','佰万','仟万','亿','拾亿','佰亿']
    const [integerPart,decimalPart]= String(amount).split('.');
    const integerDigits = integerPart.split('').map(digit => digits[parseInt(digit)]);
    let result = '';
    for(let i=0;i<integerDigits.length;i++){
        result += integerDigits[i]+ units[integerDigits.length -1- i];
    }
    if(decimalPart){
        const decimalDigits = decimalPart.split('').map(digit =>digits[parseInt(digit)]);result +='点'+decimalDigits.join('');
        }
    return result;
}

</script>
<template>
    <div>
        <el-card>
            <template #header>
                <el-form :model="quotation" ref="form" :inline="false" class="card_wrap">
                    <el-form-item label="选择客户："  prop="quotationCustomerResourcesId" class="c_item">
                            <el-select placeholder="客户名称" v-model="quotation.quotationCustomerResourcesId" style="width: 150px;">
                                <el-option v-for="item in customerResources" :label="item.customerResourcesName" :value="item.customerResourcesId">
                                </el-option>
                            </el-select>
                    </el-form-item>
                    <el-form-item label="销售负责人：" prop="quotationHeadOfSales" class="c_item">
                            <el-select v-model="quotation.quotationHeadOfSales" style="width: 150px;">
                                <el-option v-for="item in User" :label="item.nickname" :value="item.id+''">
                                </el-option>
                            </el-select>
                    </el-form-item>
                    <el-form-item label="销售原价：" prop="quotationOriginalSalePrice" class="c_item">
                            <el-input v-model="quotation.quotationOriginalSalePrice" disabled style="width: 150px;"></el-input>
                    </el-form-item>
                    <el-form-item label="销售实际价格：" prop="quotationSalesActually" class="c_item">
                            <el-input v-model="quotation.quotationSalesActually" disabled style="width: 150px;"></el-input>
                    </el-form-item>
                    <el-form-item label="优惠金额：" prop="quotationDiscountAmount" class="c_item">
                            <el-input v-model="quotation.quotationDiscountAmount" disabled style="width: 150px;"></el-input>
                    </el-form-item>
                    <el-form-item label="折扣率：" prop="quotationDiscountRate" class="c_item">
                            <el-input v-model="quotation.quotationDiscountRate" disabled style="width: 150px;"></el-input>
                    </el-form-item>
                    <el-form-item label="金额大写：" prop="quotationTheAmountIsCapitalized" class="c_item">
                            <el-input v-model="quotation.quotationTheAmountIsCapitalized" disabled style="width: 150px;"></el-input>
                    </el-form-item>
                    <el-form-item label="销售金额（不含税）：" prop="quotationTheAmountOfTheSale" class="c_item">
                            <el-input v-model="quotation.quotationTheAmountOfTheSale" disabled style="width: 150px;"></el-input>
                    </el-form-item>
                    <el-form-item label="签订时间：" prop="quotaitionDateOfSigning" class="c_item">
                            <el-date-picker v-model="quotation.quotaitionDateOfSigning"
                            type="date"
                            value-format="YYYY-MM-DD" placeholder="选择日期时间">
                        </el-date-picker>
                    </el-form-item>
                    <el-form-item label="审批人：" prop="quotaitionApprover" class="c_item">
                            <el-select v-model="quotation.quotaitionApprover" style="width: 150px;">
                                <el-option v-for="item in User" :label="item.nickname" :value="item.id+''">
                                </el-option>
                            </el-select>
                    </el-form-item>
                    <el-form-item label="是否需要生产：" prop="quotationProcurement" class="c_item">
                            <el-radio-group v-model="quotation.quotationProcurement">
                                <el-radio value="是">是</el-radio>
                                <el-radio value="否">否</el-radio>
                            </el-radio-group>
                    </el-form-item>
                    <el-form-item label="发货时间：" prop="quotaionShippingTime" class="c_item">    
                            <el-date-picker v-model="quotation.quotaionShippingTime"
                            value-format="YYYY-MM-DD" type="date" placeholder="选择日期时间">
                            </el-date-picker>
                    </el-form-item>
                    
                    <el-form-item label="地址：" prop="quotaionShippingAddress" class="c_item">
                            <el-cascader :options="pcaTextArr" clearable filterable v-model="quotation.quotaionShippingAddress"></el-cascader>
                    </el-form-item>
                    <el-form-item label="详细地址：" prop="quotaionShippingFulladdress" class="c_item">
                        <el-input v-model="quotation.quotaionShippingFulladdress" placeholder="请输入详细地址xx街道xx号" style="width:100%;"></el-input>
                    </el-form-item>
                </el-form>
                <el-button type="primary" @click="toInsert">选择产品</el-button>
                
                <el-dialog
                    :title="title"
                    v-model="isVisible"
                    :destroy-on-close="true"
                    width="60%">
                    <router-view @ref-table1="refTanle1" :data="data1">
                    </router-view>
                </el-dialog>

                <el-table :data="quoteDetails" border stripe show-overflow-tooltip>
                    <el-table-column prop="quoteDetailsProductsId" label="物料编码" width="100px;" v-model="quoteDetails.quoteDetailsProductsId"/>
                    <el-table-column prop="material.materialName" label="物料名称" width="100px;"/>
                    <el-table-column prop="material.specificationsAndModels" label="规格型号" width="100px;"/>
                    <el-table-column prop="quoteDetailsUnit" label="单位" width="60px;" v-model="quoteDetails.quoteDetailsUnit"/>
                    <el-table-column prop="material.materialOrProduct" label="物料/产品" width="100px;"/>
                    <el-table-column prop="material.category" label="所属分类名称" width="110px;"/>
                    <el-table-column prop="quoteDetailsUnitPriceOfTheSale" label="销售单价（含税）" width="180px;">
                        <template #default="scope">
                            <el-input-number v-model="scope.row.quoteDetailsUnitPriceOfTheSale" @change="shuliang" @blur="shuliang"></el-input-number>
                        </template>
                    </el-table-column>
                    <el-table-column prop="quoteDetailsVat" label="增值税率" width="180px;">
                        <template #default="scope">
                            <el-input-number v-model="scope.row.quoteDetailsVat"></el-input-number>
                        </template>
                    </el-table-column>
                    <el-table-column prop="quoteDetailsNoUnitPriceOfTheSale" label="销售单价（不含税）" width="180px;">
                        <template #default="scope">
                            <el-input-number v-model="scope.row.quoteDetailsNoUnitPriceOfTheSale"></el-input-number>
                        </template>
                    </el-table-column>
                    <el-table-column prop="quoteDetailsPrice" label="销售原价（含税）" width="180px;">
                        <template #default="scope">
                            <el-input v-model="scope.row.quoteDetailsPrice" disabled></el-input>
                        </template>
                    </el-table-column>
                    <el-table-column prop="quoteDetailsActualSellingPrice" label="实际售价/单价（含税）" width="190px;">
                        <template #default="scope">
                            <el-input-number v-model="scope.row.quoteDetailsActualSellingPrice" @change="shuliang" @blur="shuliang"></el-input-number>
                        </template>
                    </el-table-column>
                    <el-table-column prop="quoteDetailsActualTotal" label="实际合计价格（含税）" width="170px;">
                        <template #default="scope">
                            <el-input v-model="scope.row.quoteDetailsActualTotal" disabled></el-input>
                        </template>
                    </el-table-column>
                    <el-table-column prop="quoteDetailsNoActualSellingPrice" label="实际售价/单价（不含税）" width="190px;">
                        <template #default="scope">
                            <el-input-number v-model="scope.row.quoteDetailsNoActualSellingPrice" @change="shuliang" @blur="shuliang"></el-input-number>
                        </template>
                    </el-table-column>
                    <el-table-column prop="quoteDetailsNoActualTotal" label="实际合计价格（不含税）" width="190px;">
                        <template #default="scope">
                            <el-input v-model="scope.row.quoteDetailsNoActualTotal" disabled></el-input>
                        </template>
                    </el-table-column>
                    <el-table-column prop="quoteDetailsCost" label="成本单价" width="120px;">
                        <template #default="scope">
                            <el-input v-model="scope.row.quoteDetailsCost" disabled></el-input>
                        </template>
                    </el-table-column>
                    <el-table-column prop="quoteDetailsTotalCost" label="成本合计" width="120px;">
                        <template #default="scope">
                            <el-input v-model="scope.row.quoteDetailsTotalCost" disabled></el-input>
                        </template>
                    </el-table-column>
                    <el-table-column prop="quoteDetailsWarehouse" label="出库仓库" width="120px;">
                        <template #default="scope">
                            <el-select class="sousuo" placeholder="仓库" v-model="scope.row.quoteDetailsWarehouse">
                                <el-option v-for="item in warehouse" :label="item.warehouseName" :value="item.warehouseId">
                                    </el-option>
                            </el-select>
                        </template>
                    </el-table-column>
                    <el-table-column prop="quoteDetailsNumberOfSales" label="数量" width="180px;">
                        <template #default="scope">
                            <el-input-number v-model="scope.row.quoteDetailsNumberOfSales" @change="shuliang" @blur="shuliang"></el-input-number>
                        </template>
                    </el-table-column>
                    
                </el-table>
                
                
                <el-form-item>
                    <el-button type="primary" @click="onSubmit">立即修改</el-button>
                </el-form-item>
            </template>
        </el-card>
    </div>
</template>
<style scoped>

.card_wrap {
    width: 98%;
    display: flex;
    flex-wrap: wrap;
    justify-content:flex-start;
}
.c_item{
    flex:1;
    margin:0px 5px 15px 0;
    width: calc((100%-0px)/2); 
    min-width:calc((100% - 10px)/2);
    max-width:calc((100% - 10px)/2);
}
</style>